
export default class drawFence{
     constructor(props) {
        //这里初始化class的时候需要传map对象进来
        this.map = props;
        this.source;
        this.fenceLayer;
        this.draw;
        //样式
        this.fenceStyle = new ol.style.Style({
            fill: new ol.style.Fill({
                color: 'rgba(0, 0, 0, 0.4)'
            }),
            stroke: new ol.style.Stroke({
                color: '#c7254e',
                width: 2
            }),
            // image: new ol.style.Circle({
            //     radius: 7,
            //     fill: new ol.style.Fill({
            //         color: '#ffcc33'
            //     })
            // })
        })
        this.init()
    }
    init() {
        //临时图层的数据源
        this.source = new ol.source.Vector();
        //新建临时图层，并设置临时图层渲染各种要素的样式
        this.fenceLayer = new ol.layer.Vector({
            source: this.source,
            style: this.fenceStyle
        });
        this.map.addLayer(this.fenceLayer)
    }

    //转换坐标点（多）
    transPoints(points) {
        let arr = points.split(';');
        let point = [];
        arr.forEach(item => {
            let newPoint = item.split(',');
            point.push(newPoint)
        })
        let _points = point.map(item => {
            item = [parseFloat(item[0]), parseFloat(item[1])]
            item = ol.proj.transform(item, 'EPSG:4326', 'EPSG:3857');
            return item;
        })
        return _points;
    }
    //转换圆的
    transPoint(point) {
        let item = point.split(',')
        item = [parseFloat(item[0]), parseFloat(item[1])]
        let _point = ol.proj.transform(item, 'EPSG:3857', 'EPSG:4326');
        return _point;
    }
    /**
     * 
     * @param {*} fenceId 围栏id
     * @param {*} center 中心坐标
     * @param {*} radius 半径
     * @param {*} name 围栏名
     */
    showCircle(fenceId, center, radius, name) {
       try {
        // var edgeCoordinate = [center[0] + radius, center[1]];
        // var wgs84Sphere = new ol.Sphere(6378137);
        // var groundRadius = wgs84Sphere.haversineDistance(
        //     ol.proj.transform(center, 'EPSG:3857', 'EPSG:4326'), 
        //     ol.proj.transform(edgeCoordinate, 'EPSG:3857', 'EPSG:4326')
        // );

            // let centerPoint = this.transPoint(center)
            // radius = parseFloat(radius)
            let circleRadius =  radius / this.map.getView().getProjection().getMetersPerUnit();
            console.log('circleRadius',circleRadius);
            // 获取此投影每单位的米数
            console.log('getMetersPerUnit',this.map.getView().getProjection().getMetersPerUnit());
            console.log('METERS_PER_UNIT',ol.proj.METERS_PER_UNIT['degrees']);

            var circleFeature = new ol.Feature({ //路线
                geometry: new ol.geom.Circle(center, circleRadius),
            });
            circleFeature.setId(fenceId)
            this.source.addFeature(circleFeature);
       } catch (error) {
           console.log('err',error)
       }
    }
    /**
     *
     * @param {*} fenceId 围栏id
     * @param {*} points 多边形坐标点
     * @param {*} name 围栏名
     */
    showPolygon(fenceId, points, name) {
        let _points = this.transPoints(points)
        _points = [_points]
        //多边形的数据格式是[[[lng,lat],[lng,lat]……]]外围两个中括号
        var polygonFeature = new ol.Feature({ //路线
            geometry: new ol.geom.Polygon(_points)

        });
        polygonFeature.setId(fenceId)
        this.source.addFeature(polygonFeature);
        console.log(this.source.getFeatures())
    }
    /**
     * 
     * @param {*} fenceId 围栏id
     * @param {*} points 线型的点坐标
     * @param {*} name 围栏名字
     */
    showPolyline(fenceId, points, name) {

        let _points = this.transPoints(points)
        var lineFeature = new ol.Feature({ //路线
            geometry: new ol.geom.LineString(_points, 'XY'),
        });
        lineFeature.setId(fenceId)

        //将所有矢量图层添加进去
        this.source.addFeature(lineFeature);
    }
    //回显围栏
    showFence(obj) {
        let {
            fenceId,
            name,
            type,
            center,
            radius,
            points
        } = obj;

         const handle = {
            'circle': (fenceId, center, radius, name) => {
                this.showCircle(fenceId, center, radius, name)
            },
            'polygon': (fenceId, points, name) => {
               this.showPolygon(fenceId, points, name)
            },
            'polyline': (fenceId, points, name) => {
               this.showPolyline(fenceId, points, name)
            }
        }
        if (handle[type]) handle[type](fenceId, center, radius, name)
    }
}